<template>
	<view   class="bigbox">
    <view class="xxxg" @click="showmodeal=true">
      信息修改
    </view>
      <view class="tetbox">
        <view class="henbox" v-for="(item,index) in list">
          <view class="">
            {{item.title}}
          </view>
          
          <view class="">
            {{item.txt}}
          </view>
        </view>
      </view>

      	<u-popup :show="showmodeal" @close="showmodeal=false"  round="30rpx" mode="center">
                  <view class="popbox">
                    <view class="henbox" v-for="(item,index) in list1">
                      <view class="" style="margin-top: 10rpx;">
                        {{item.title}}
                      </view>
                      <view class="inputbox">
                          <u--input
                            placeholder="请输入内容"
                            border="surround"
                            v-model="item.txt"
                          ></u--input>
                    
                      </view>
                    </view>
                    
                    <view class="buttonbox" @click="buttonbox()">
                      确认修改
                    </view>
                  </view>
      		</u-popup>
	</view>
</template>

<script>
	import mixins from '@/common/js/mixins';
	export default {
		mixins: [mixins],
		data() {
			return {
        showmodeal:false,
				list:[
          {title:'单位名称',txt:'11'},
          {title:'成立时间',txt:'11'},
          {title:'单位类型',txt:'11'},
          {title:'单位类型',txt:'11'},
          {title:'联系人',txt:'11'},
          {title:'联系电话',txt:'11'},
          {title:'推荐人',txt:'11'},
          {title:'注册日期',txt:'11'},
          {title:'单位地址',txt:'11'},
          
          ],
          list1:[
          {title:'单位名称',txt:'11'},
          {title:'成立时间',txt:'11'},
          {title:'单位类型',txt:'11'},
          {title:'单位类型',txt:'11'},
          {title:'联系人',txt:'11'},
          {title:'联系电话',txt:'11'},
          {title:'推荐人',txt:'11'},
          {title:'注册日期',txt:'11'},
          {title:'单位地址',txt:'11'},
          ]
			}
			
		},
		methods: {
buttonbox(){
  this.list = this.list1
  this.showmodeal = false
}
		}
	}
</script>

<style lang="scss" scoped>
  .bigbox {
    width: 100%;
    height: 88vh;
    background: #F5F5F5;
    display: flex;
    flex-direction: column;
    align-items: center;
    .xxxg {
      color: skyblue;
      margin-top: 20rpx;
      margin-left: 60%;
    }
    .tetbox {
      width: 700rpx;
      height: 700rpx;
      background-color: #fff;
      margin-top: 30rpx;
      border-radius: 30rpx;
 
      .henbox {
 
        margin-top: 25rpx;
        margin-bottom:30rpx ;
       display: flex;
       justify-content: space-between;
       padding: 0 70rpx; 
      }
     
    }
    .popbox {
      width: 680rpx;
      height: 1100rpx;
      border-radius: 30rpx;
      .henbox {
       
        margin-top: 25rpx;
        margin-bottom:30rpx ;
       display: flex;
       justify-content: space-between;
       padding: 0 70rpx; 
      }
      .inputbox {
        // height: 30rpx;
      }
      .buttonbox {
        width: 600rpx;
        height: 80rpx;
        background-color: dodgerblue;
        color: #fff;
        text-align: center;
        line-height: 80rpx;
        border-radius: 70rpx;
        margin-top: 30rpx;
        margin-left: 40rpx;
      }
    }
    }
</style>